<#include "../common/common.html"/>
<@layout>
<script type="text/javascript">
	var url;
	/**
	 * 打开新增用户的表单，录入用户信息
	 */
	function newModel() {
		$('#dlg').dialog('setTitle', '新增用户资料').dialog('open');
		$('#myform').form('clear');
		//$('#roles').combotree("reload");
		url = '${ctx}/blog/save';
	}
	/**
	 * 编辑选中的用户信息
	 */
	function editModel() {
		var row = $('#dt-grids').datagrid('getSelected');
		if (row) {
			$('#dlg').dialog('setTitle', '修改用户资料').dialog('open');
			$('#myform').form('load', row);
			url = '${ctx}/blog/update/' + row.id;
		} else {
			$.messager.show({
				title : '提示',
				msg : '请先选择用户，再进行修改。',
				timeout:2000
			});
		}
	}

	function removeModel() {
		var row = $('#dt-grids').datagrid('getSelected');
		if (row) {
			$.messager.confirm('确认', '您确定要删除选中的用户吗?', function(r) {
				if (r) {
					$.post('${ctx}/blog/delete/' + row.id, function(data) {
						$.messager.show({
							title : '提示',
							msg : data,
							timeout:2000
						});
						$('#dt-grids').datagrid('reload'); // reload the user data
					},'text');
				}
			});
		}
	}
	/**
	 * 保存新增的用户数据，并对登录密码进行校验
	 */
	function saveModel() {
		$('#myform').form('submit', {
			url : url,
			onSubmit : function() {
				return $(this).form('validate');
			},
			success : function(data) {
	        	$.messager.show({ // show error message
					title : '提示',
					msg : data,
					timeout:2000
				});  
				$('#dlg').dialog('close');
				$('#dt-grids').datagrid('reload');
			}
		});
	}

	function queryModel() {
		$('#dt-grids').datagrid('load', $.getQueryParam('queryTable'));
	}

</script>
<body class="easyui-layout">
	<div data-options="region:'north'"
		style="height: 60px; padding: 4px">
		<table id='queryTable' cellpadding="0" cellspacing="0"
			class="form-table" align='center'>
			<tr>
				<td style="width: 60px">用 户 名：</td>
				<td style="width: 180px"><input name="username"
					class="query" style="width: 150px" /></td>
				<td style="width: 60px">中文名称：</td>
				<td style="width: 180px"><input name="cnname"
					class="query" style="width: 150px" /></td>
				<td style="width: 60px">电子邮箱：</td>
				<td style="width: 180px"><input name="email"
					class="query" style="width: 150px"
					data-options="validType:'email'" /></td>
			</tr>
			<tr>
				<td>手机号码：</td>
				<td><input name="telphone" class="easyui-validatebox  query"
					style="width: 150px" data-options="validType:'mobile'" /></td>
				<td>在线状态：</td>
				<td><select name="status" class="easyui-combobox  query"
					panelHeight="50" style="width: 150px">
						<option value=1>在线</option>
						<option value=0>离线</option>
				</select></td>
				<td colspan='2' align='center'><a href="#"
					class="easyui-linkbutton" iconCls="icon-search"
					onclick="queryModel()">查询</a></td>
			</tr>
		</table>
	</div>
	<div id='center' region="center" title='结果列表' border="false" >
		<table id="dt-grids" class="easyui-datagrid"
		 data-options="singleSelect:true,rownumbers:true,fit:true,pagination:true,toolbar:'#toolbar',url:'${ctx}/blog/query'">
			<thead>
				<tr>
					<th data-options="field:'title',width:200">标题</th>
					<th data-options="field:'content',width:300">内容</th>
				</tr>
			</thead>
		</table>

		<div id="toolbar">
			<a href="#" class="easyui-linkbutton" iconCls="icon-add" plain="true"
				onclick="newModel()">新增</a> <a href="#" class="easyui-linkbutton"
				iconCls="icon-edit" plain="true" onclick="editModel()">编辑</a> <a
				href="#" class="easyui-linkbutton" iconCls="icon-remove"
				plain="true" onclick="removeModel()">删除</a>
		</div>
	</div>
	<div id="dlg" class="easyui-dialog" style="width: 500px; height: 400px;padding:10px"
		closed="true" modal="true" buttons="#dlg-buttons">
		<form id="myform" method="post">
			<input type="hidden" name="id"/>
			<table cellpadding="0" cellspacing="0" class="form-table"
				align='center'>
				<tr>
					<td style="width: 40px">标题：</td>
					<td style="width: 180px"><input id='title' name="title"
						class="easyui-validatebox" required="true"
						style="width: 150px" /></td>
				</tr>
				<tr>
					<td>内容：</td>
					<td><textarea name="content" cols="80" rows="10"></textarea></td>
				</tr>
			</table>
		</form>
		<div id="dlg-buttons" style="text-align: center">
			<a href="#" class="easyui-linkbutton" iconCls="icon-save"
				onclick="saveModel()">保存</a> <a href="#" class="easyui-linkbutton"
				iconCls="icon-cancel" onclick="javascript:$('#dlg').dialog('close')">取消</a>
		</div>
	</div>
</body>
</@layout>